import React, { Component } from 'react';
import {
    WhiteSpace,
    Flex,
    List,
    Button,
    Icon,
    Grid,
    Modal,
    Switch
} from 'antd-mobile';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import MyScroll from '../../components/MyScroll/MyScroll';
import CouponItem from './CouponItem';
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
import { coupon_list } from './coupon.less'
const Item = List.Item;
import noCoupon from "../../assets/img/noCoupon.svg";


class Coupon extends Component {
    constructor(props) {
        super(props);
    }


    componentDidMount() {
        this.props.dispatch({ type: 'goodsDetail/couponlistEFF', obj: { storeId: this.props.match.params.storeId } });
    }



    render() {
        const { goodsDetail, dispatch, match } = this.props;
        const { couponList=[] } = goodsDetail;

        console.log(this.props);


        return (
            <Flex
                style={{
                    height:"100%"
                }}
                direction="column"

            >
                <NavTopBar dispatch={dispatch} title="优惠卷"></NavTopBar>
                <MyScroll>
                  <div className={coupon_list}>
                      {
                          couponList.length > 0 ?
                              <div>
                                  {
                                      couponList.map((v,i,a)=>{

                                          return <CouponItem storeId={match.params.storeId} dispatch={dispatch} key={i} Item={v}></CouponItem>
                                      })
                                  }
                              </div> :
                              <Flex direction="column" justify="center" style={{ marginTop:'1rem' }}>
                                  <Icon style={{ width:"50%", height:"auto" }}  type={noCoupon.id} />
                                  <div>没有优惠卷了</div>
                              </Flex>

                      }
                  </div>

                </MyScroll>



            </Flex>
        )
    }
}

export default connect(({goodsDetail})=>({goodsDetail}))(Coupon);
